<template>
  <div>
    <!--  -->
    <el-dialog title="设备基值详情" :visible.sync="$parent.opendetailed" width="70%" append-to-body>
      <div class="center_dialog">
        <el-divider>基本信息</el-divider>
        <div class="dialog_left">
          <div>
            <el-image :src="form.image" style="width:100%;height: 100%;">
              <div slot="placeholder" class="image-slot">
                加载中<span class="dot">...</span>
              </div>
            </el-image>
          </div>
          <div>
            <el-descriptions direction="vertical" :column="5" border>
              <el-descriptions-item label="设备名称">{{ form.equipmentName || '-' }}</el-descriptions-item>
              <el-descriptions-item label="品牌" :span="3">{{ form.brand || '-' }}</el-descriptions-item>
              <el-descriptions-item label="规格型号" :span="3">{{ form.model || '-' }}</el-descriptions-item>
              <el-descriptions-item label="单位" :span="3">
                {{ form.unitName || '-' }}
              </el-descriptions-item>
              <el-descriptions-item label="供应商">{{ form.supplierName || '-' }}</el-descriptions-item>
              <el-descriptions-item label="计量设备" :span="3">{{ meterageFlag[form.meterageFlag] || '-' }}
              </el-descriptions-item>
              <el-descriptions-item label="计量编号" :span="3">{{ form.meterageNum || '-' }}</el-descriptions-item>
              <el-descriptions-item label="类别" :span="3">{{ form.typeName || '-' }}</el-descriptions-item>
              <el-descriptions-item label="状态">
                <dict-tag :options="statusFlag" :value="form.status" />
                <!-- {{statusFlag[form.status]  || '-'}} -->
              </el-descriptions-item>
              <el-descriptions-item label="备注">{{ form.remark || '-' }}</el-descriptions-item>
            </el-descriptions>
          </div>
        </div>
        <el-divider>相关附件</el-divider>
        <el-link type="primary" :href="form.file" target="_blank">{{ form.file }}</el-link>
      </div>

    </el-dialog>
  </div>
</template>

<script>
// import { getchangebase } from '@/api/equipment/equipment.js'
// import Upload from '@/components/upload/index.vue'
export default {
  name: 'detailed',
  props: ['rowObj'],
  components: {
    // Upload
  },
  data () {
    return {
      form: {
      },
      dict: [],//单位字典列表
      typedict: [],//类别列表
      supplierdict: [],//供应商列表
      // dictdatalist:[],
      rules: {
        equipmentName: { required: true, message: '必填', trigger: 'blur' },
        brand: { required: true, message: '必填', trigger: 'blur' },
        model: { required: true, message: '必填', trigger: 'blur' },
        supplierId: { required: true, message: '必填', trigger: 'blur' },
        typeId: { required: true, message: '必填', trigger: 'blur' },
        unit: { required: true, message: '必填', trigger: 'blur' },
        meterageFlag: { required: true, message: '必填', trigger: 'blur' },
        image: { required: true, message: '必填', trigger: 'blur' },
        meterageNum: { required: true, message: '必填', trigger: 'blur' },
      }
    }
  },
  created () {
    this.getlist()
  },
  methods: {
    async getlist () {
      let res = await getchangebase(this.rowObj.equipmentBaseId);
      // let data = await getdatalist({ dictType: 'base_unit' })//单位词典
      //  this.dictdatalist=data.data
      this.form = res.data
    },
  }
}
</script>

<style lang="scss" scoped>
.center_dialog {
  // text-align: center;
  width: 90%;
  margin: 0px auto;
}

.dialog_left {
  width: 100%;
  display: flex;
}

.dialog_left>div:nth-child(1) {
  flex: 1
}

.dialog_left>div:nth-child(2) {
  flex: 2;
  margin-left: 10px
}
</style>